iT邦幫忙

2022 iThome 鐵人賽

DAY 18
0
自我挑戰組

學習JavaScript的基礎概念系列 第 18

Day18 物件的屬性、方法,查看型別typeof、instanceof

  • 分享至 

  • xImage
  •  

property 屬性
method 方法
typeof:運算子,可查看型別。
instanceof:查看物件是否在原型鍊上。

設定屬性和方法

可用點 . 或中括號[]來取得屬性的內容
例:

let person = { 
    //設定屬性 
    name : "John", 
    age : 18,

    //設定方法
    sayHi() {
        console.log("Hi.");
    },
    walk() { 
        console.log("walking"); 
    }
}
console.log(person.name);
console.log(person["name"]);
person.sayHi();
person.walk();

typeof

typeof是個運算子,會告訴你它的型別是什麼:

var a = 3;
console.log(typeof a);

var b = "Hello";  
console.log(typeof b);

var c = {};   
console.log(typeof c);

執行結果,分別為數值、字串、物件
https://ithelp.ithome.com.tw/upload/images/20221002/2015207031xPxZfzbE.png

但我傳一個陣列,顯示結果卻是物件,所以可以用別的方法。
可以用原型和.call的概念,不會在Object做事,而是用 .call呼叫這個函數,告訴它這個變數要指向哪裡,到原型上呼叫toString,所以可用這方法知道它是陣列。

var d = [];    
console.log(typeof d);
console.log(Object.prototype.toString.call(d));

執行結果
https://ithelp.ithome.com.tw/upload/images/20221002/20152070cQBgAnPsJ9.png

也可以查看是否為函式:

var f = function() {}
console.log(typeof f);

執行結果
https://ithelp.ithome.com.tw/upload/images/20221002/20152070O8ma9AW1yU.png

instanceof

查看物件是否在原型鍊上:

function Person(name) {
    this.name = name;
}

var e = new Person('Jane');
console.log(typeof e);
console.log(e instanceof Person);

執行結果:e是物件,並且在原型鍊上所以是true
https://ithelp.ithome.com.tw/upload/images/20221002/201520706Y5pzChRKU.png

undefined的型別就是undefined
null顯示是物件,一直是JavaScript的bug

console.log(typeof undefined); 
console.log(typeof null);

執行結果:
https://ithelp.ithome.com.tw/upload/images/20221002/20152070EJoR8k3FeD.png


上一篇
Day17 for/while迴圈、break、continue
下一篇
Day19 什麼是JSON
系列文
學習JavaScript的基礎概念30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言